import React from 'react';
import { inject, observer } from 'mobx-react';
import { Button, Spin } from 'antd';
import { toJS } from 'mobx';
import { WeaTableNew } from 'comsMobx';

const WeaTable = WeaTableNew.WeaTable;
import { WeaRightMenu, WeaTop, WeaTab, WeaErrorPage, WeaTools, WeaProgress, WeaBrowser, WeaAlertPage } from 'ecCom';
import ContractInfo from './ContractInfo';
import { WeaLocaleProvider } from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;

@inject('contractManageStore')
@observer
class ContractView extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { location: { query }, contractManageStore } = this.props;
    contractManageStore.getContractInfo({ ...query, operation: 'view' }, '1', true, '1');
    contractManageStore.getFormCondition();
    if (window.location.pathname.indexOf('/spa/crm/mobx/index') >= 0) {
      document.title = getLabel(34244, '合同信息');
    }
  }
  componentWillReceiveProps(nextProps) {
    const keyOld = this.props.location.key;
    const keyNew = nextProps.location.key;
    const paramsOld = this.props.location.query;
    const paramsNew = nextProps.location.query;
    if (keyOld !== keyNew || paramsOld !== paramsNew) {
      const { location: { query }, contractManageStore } = nextProps;
      contractManageStore.getContractInfo({ ...query, operation: 'view' }, '1', true, '1');
    }
  }
  render() {
    const { contractManageStore, location } = this.props;
    const { title, loading, form, noExit, hasRight, verified, cardloading } = contractManageStore;
    if (noExit) {
      return (<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@hxvuqo`} >
        <div style={{ color: '#000' }}>
          {getLabel(82090, '无匹配的结果！')}
        </div>
      </WeaAlertPage>
      );
    }
    if (verified && !hasRight && !noExit) {
      return (<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@h4n03b`} >
        <div style={{ color: '#000' }}>
          {getLabel(2012, '对不起，您暂时没有权限！')}
        </div>
      </WeaAlertPage>
      );
    }
    if (verified && hasRight && !noExit) {
      return (

        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@mo8ksq`} datas={this.getRightMenu()} onClick={this.onRightMenuClick.bind(this)} >
          <WeaTop
            ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@f1unaa`}
            title={getLabel(34244, '合同信息')}
            loading={loading}
            icon={<i className="icon-coms-crm" />}
            iconBgcolor="#96358a"
            buttons={this.getTopButtons(this.props.ecId || '')}
            buttonSpace={10}
            showDropIcon
            dropMenuDatas={this.getRightMenu()}
          >
            <ContractInfo ecId={`${this && this.props && this.props.ecId || ''}_ContractInfo@j39pni`} contentStore={contractManageStore} />
          </WeaTop>
        </WeaRightMenu>
      );
    }
    return <div />;
  }
  getTopButtons(ecId) {
    const { contractManageStore, location } = this.props;
    const { status, contractId, canEdit, dialogPageType, modleSelectTabKey, editInfo, saveInfo, cardloading } = contractManageStore;
    const btns = [];
    if (dialogPageType == 'view') {
      if (canEdit && status == '0') {
        btns.push((<Button ecId={`${ecId}_Button@0iucyt@edit`} type="primary" onClick={() => { editInfo(contractId); }}>{getLabel(93, '编辑')}</Button>));
      }
    } else if (dialogPageType == 'edit') {
      if (canEdit && status == '0') {
        btns.push((<Button ecId={`${ecId}_Button@gso398@save`} type="primary" disabled={cardloading} onClick={() => { saveInfo(contractId); }}>{getLabel(86, '保存')}</Button>));
      }
    }
    return btns;
  }
  getRightMenu() {
    const { rightMenuInfo, cardloading } = this.props.contractManageStore;
    const items = [];
    rightMenuInfo.map((item, index) => {
      items.push({
        icon: <i className={item.icon} />,
        content: item.content,
        disabled: cardloading,
        key: item.key,
      });
    });
    return items;
  }
  onRightMenuClick(key) {
    const { location, contractManageStore } = this.props;
    const { contractId, hasTab, sign, complete, approveInfo, statusBack, editInfo, getContractInfo, saveInfo, getFormCondition, getContractShareList } = contractManageStore;
    if (key == '2') { // 签单
      sign(contractId, 'rightmenu');
    }
    if (key == '3') { // 执行完成
      complete(contractId, 'rightmenu');
    }
    if (key == '8') { // 重新打开
      statusBack(contractId, 'rightmenu');
    }
    if (key == '6') { // 共享设置
      getFormCondition();
      getContractShareList({ contractId }, '3', true);
    }
    if (key == '0') { // 编辑
      editInfo(contractId);
    }
    if (key == '1') { // 提交审批
      approveInfo(contractId, 'rightmenu');
    }
    if (key == '7') { // 保存
      saveInfo(contractId, location.query.customerId || '');
    }
    if (key == '9') { // 返回
      getContractInfo({ contractId, operation: 'view' }, '1', hasTab);
    }
  }
}

export default WeaTools.tryCatch(React,
  props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@tb1bhw`} msg={props.error ? props.error : getLabel(129417, '服务器运行出错，请联系系统管理员！')} />,
  { error: '' },
)(ContractView);
